<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initialscale=1, minimum-scale=1">
<title>Summer Film Festival - Showtimes</title>
<link href="stijl/html5reset.css" rel="stylesheet" type="text/css">
<link href="stijl/algemeen.css" rel="stylesheet" type="text/css">
<link href="stijl/subnav.css" rel="stylesheet" type="text/css">
<link href="stijl/overzicht.css" rel="stylesheet" type="text/css">
<link href="stijl/spinner.css" rel="stylesheet" type="text/css">
<link rel="icon" href="beeld/film_factory_logo_geen_letters.png">
<script src="scripts/jquery.js"></script>
<script src="scripts/algemeen.js" type="application/javascript"></script>
<script src="scripts/overzicht.js" type="application/javascript"></script>
</head>

<body onLoad="laadFilms('friday')">

<header>
		<a href="#"><img id="menu_knop_mobiel" onclick="gaNaarNav()" alt="menu toggle" src="beeld/menu_knop_mobiel.png" height="70" width="70"/></a>
        
        <h1 id="titel">
            <a id="titel_link" href="index.html">Summer Film Festival</a>
            <!--SUMMER FILM FESTIVAL-->
        </h1>
        
        <nav id="navigatie_desktop">
            <ul>
                <a href="index.html"><li id="home">Home</li></a>
                <a href="overzicht.html"><li id="programmatie">Programme</li></a>
                <a href="contact.html"><li>Contact</li></a>
                <a href="tickets.html"><li id="tickets">Tickets</li></a>
            </ul>
        </nav>
        
        <nav id="mobiele_navigatie">
            <ul>
                <a href="index.html"><li id="home_mobiel">Home</li></a>
               	<a href="overzicht.html"><li id="programmatie_mobiel">Programme</li></a>
                <a href="contact.html"><li>Contact</li></a>
                <a href="tickets.html"><li id="tickets_mobiel">Tickets</li></a>
            </ul>
        </nav>
</header>

<div id="subnavigatie">
	<ul>
        	<a href="overzicht.html"><li class="actief">Showtimes</li></a>
        	<a href="categorie.html" onClick="setCookie('categorie','klass')"><li id="klass">Classics</li></a>   
        	<a href="categorie.html" onClick="setCookie('categorie','cult')"><li id="cult">Cult</li></a>  
        	<a href="categorie.html" onClick="setCookie('categorie','pop')"><li id="pop">Popular</li></a>   
    </ul>
</div>

<div id="inhoud">
	<h2 onClick="toggle('vrijdag')">
    	Friday <span class="klein"><a href="javascript:void(0)" id="togglevrijdag">Hide</a></span>
    </h2>
    <div class="zalen" id="vrijdag">
      	<article class="zaal_A">
        	<table>
            	<tr id="friday_A">
                	<th colspan="2">
                   	Loading...
                    <div class="spinner_klein">
                      <div class="spinner-container container1">
                        <div class="circle1"></div>
                        <div class="circle2"></div>
                        <div class="circle3"></div>
                        <div class="circle4"></div>
                      </div>
                      <div class="spinner-container container2">
                        <div class="circle1"></div>
                        <div class="circle2"></div>
                        <div class="circle3"></div>
                        <div class="circle4"></div>
                      </div>
                      <div class="spinner-container container3">
                        <div class="circle1"></div>
                        <div class="circle2"></div>
                        <div class="circle3"></div>
                        <div class="circle4"></div>
                      </div>
                    </div>
                    </th>
              </tr>
            </table>
        </article>
        <article class="zaal_B">
        	<table>
            	<tr id="friday_B">
                	<th colspan="2">
                   	Loading...
                    <div class="spinner_klein">
                      <div class="spinner-container container1">
                        <div class="circle1"></div>
                        <div class="circle2"></div>
                        <div class="circle3"></div>
                        <div class="circle4"></div>
                      </div>
                      <div class="spinner-container container2">
                        <div class="circle1"></div>
                        <div class="circle2"></div>
                        <div class="circle3"></div>
                        <div class="circle4"></div>
                      </div>
                      <div class="spinner-container container3">
                        <div class="circle1"></div>
                        <div class="circle2"></div>
                        <div class="circle3"></div>
                        <div class="circle4"></div>
                      </div>
                    </div>
                    </th>
                </tr>
            </table>
        </article>
    </div>
    <h2 onClick="toggle('zaterdag')">
    	Saturday <span class="klein"><a href="javascript:void(0)" id="togglezaterdag">Show</a></span>
    </h2>
    <div class="zalen" id="zaterdag">
        <article class="zaal_A">
        	<table>
            	<tr id="saturday_A">
                	<th colspan="2">
                   	Loading...
                    <div class="spinner_klein">
                      <div class="spinner-container container1">
                        <div class="circle1"></div>
                        <div class="circle2"></div>
                        <div class="circle3"></div>
                        <div class="circle4"></div>
                      </div>
                      <div class="spinner-container container2">
                        <div class="circle1"></div>
                        <div class="circle2"></div>
                        <div class="circle3"></div>
                        <div class="circle4"></div>
                      </div>
                      <div class="spinner-container container3">
                        <div class="circle1"></div>
                        <div class="circle2"></div>
                        <div class="circle3"></div>
                        <div class="circle4"></div>
                      </div>
                    </div>
                    </th>
              </tr>
            </table>
        </article>
        <article class="zaal_B">
        	<table>
            	<tr id="saturday_B">
                	<th colspan="2">
                   	Loading...
                    <div class="spinner_klein">
                      <div class="spinner-container container1">
                        <div class="circle1"></div>
                        <div class="circle2"></div>
                        <div class="circle3"></div>
                        <div class="circle4"></div>
                      </div>
                      <div class="spinner-container container2">
                        <div class="circle1"></div>
                        <div class="circle2"></div>
                        <div class="circle3"></div>
                        <div class="circle4"></div>
                      </div>
                      <div class="spinner-container container3">
                        <div class="circle1"></div>
                        <div class="circle2"></div>
                        <div class="circle3"></div>
                        <div class="circle4"></div>
                      </div>
                    </div>
                    </th>
                </tr>
            </table>
        </article>
    </div>
   	<h2 onClick="toggle('zondag')">
    	Sunday <span class="klein"><a href="javascript:void(0)" id="togglezondag">Show</a></span>
    </h2>
    <div class="zalen" id="zondag">
        <article class="zaal_A">
        	<table>
            	<tr id="sunday_A">
                	<th colspan="2">
                   	Loading...
                    <div class="spinner_klein">
                      <div class="spinner-container container1">
                        <div class="circle1"></div>
                        <div class="circle2"></div>
                        <div class="circle3"></div>
                        <div class="circle4"></div>
                      </div>
                      <div class="spinner-container container2">
                        <div class="circle1"></div>
                        <div class="circle2"></div>
                        <div class="circle3"></div>
                        <div class="circle4"></div>
                      </div>
                      <div class="spinner-container container3">
                        <div class="circle1"></div>
                        <div class="circle2"></div>
                        <div class="circle3"></div>
                        <div class="circle4"></div>
                      </div>
                    </div>
                    </th>
              </tr>
            </table>
        </article>
        <article class="zaal_B">
        	<table>
            	<tr id="sunday_B">
                	<th colspan="2">
                   	Loading...
                    <div class="spinner_klein">
                      <div class="spinner-container container1">
                        <div class="circle1"></div>
                        <div class="circle2"></div>
                        <div class="circle3"></div>
                        <div class="circle4"></div>
                      </div>
                      <div class="spinner-container container2">
                        <div class="circle1"></div>
                        <div class="circle2"></div>
                        <div class="circle3"></div>
                        <div class="circle4"></div>
                      </div>
                      <div class="spinner-container container3">
                        <div class="circle1"></div>
                        <div class="circle2"></div>
                        <div class="circle3"></div>
                        <div class="circle4"></div>
                      </div>
                    </div>
                    </th>
                </tr>
            </table>
        </article>
   	</div>
</div>

<footer>
	<div id="footer_menu">
        <table>
            <tr>
                <th><a href="index.html">Home</a></th>
                <th><a href="overzicht.html">Programme</a></th>
                <th><a href="contact.html">Contact</a></th>
                <th><a href="tickets.html">Tickets</a></th>
            </tr>
            <tr>
            	<td></td>
            	<td><a href="overzicht.html">Showtimes</a></td>
                <td>T: +32 16 68 23 80</td>
                <td></td>
            </tr>
            <tr>
            	<td></td>
            	<td><a href="categorie.html">Classics</a></td>
                <td>F: +32 16 68 23 90</td>
                <td></td>
            </tr>
            <tr>
            	<td></td>
            	<td><a href="categorie.html">Cult</a></td>
                <td><a href="mailto:wim.hambrouck@student.ehb.be?subject=Mail%20from%20contact%20page">Send mail</a></td>
                <td></td>
            </tr>
            <tr>
            	<td></td>
            	<td><a href="categorie.html">Popular</a></td>
                <td>Nijverheidskaai 170<br/>Anderlecht</td>
                <td></td>
            </tr>
        </table>
    	<p id="tmdb_tekst"><a href="http://www.themoviedb.org/" target="_blank"><img id="tmdb_img" alt="TMDb logo" src="beeld/TMDb.png" width="50"/></a>This product uses the TMDb API but is not endorsed or certified by TMDb.</p>
        
        <p id="film_factory_tekst">
        	<img id="film_factory_logo" alt="Film Factory logo" src="beeld/film_factory_logo.png" width="50"/>
            The Summer Film Festival is an initiative by the Film Factory.
        </p>
    </div>
</footer>

</body>
</html>
